<template>
    <view class="container">
        <view class="assistance_banner">
            <image mode="widthFix" :src="bannerImg" class="assistance_banner_img"></image>
        </view>
       <view class="mian_assistance_block" style="background: #e4311d">
           <view class="assistance_detail_block">
               <image class="assistance_detail_bg" src="https://image1.sansancloud.com/xianhua/2020_5/25/15/1/9_479.jpg?x-oss-process=style/preview"></image>
               <view class="assistance_detail_info">
                   <text class="count_down_text" :style="{color:assistanceDetail.frontColor||defaultColor}">“ 领取优惠券 ”</text>
                   <view class="assistance_btn_block" :style="{border:'1rpx solid '+(assistanceDetail.buttonColor||defaultColor)}">
                       <input placeholder="请输入券码" @input="couponSecretCodeFun"/>
                   </view>
                   <view class="assistance_btn_block" :style="{border:'1rpx solid '+(assistanceDetail.buttonColor||defaultColor)}">
                       <input  placeholder="请输入密码" @input="couponSecretPasswordFun"/>
                   </view>
                   <view class="assistance_btn_block" @click="gainCouponFun()" :style="{background:assistanceDetail.buttonColor||defaultColor,color: '#fff',padding:'20rpx 12rpx'}">
                       <text>领取优惠券</text>
                   </view>
                   <text class="user_view_block">
                       Tip:请输入券号及密码领取相应优惠券
                   </text>
               </view>
           </view>
       </view>
       <!-- 填写表单弹窗动画 -->
       <view class='zhezhao' v-if="showAttendForm" @tap='closeZhezhao'></view>
       <view class='popupFormDetail' :animation="animationData">
         <view class='form_title' >
           <text ></text>
           <text>请填写以下信息</text>
           <image class='close_popup_icon' src='https://image1.sansancloud.com/xianhua/2019_7/31/15/25/40_755.jpg?x-oss-process=style/preview_120' @click='closeZhezhao'></image>
         </view>
         <scroll-view scroll-y  style='max-height:700rpx'>
           <view v-if="sendOptionData&&showAttendForm">
              <form-detail-component id="submitAssistanceForm" :receiveData="sendOptionData" :showTitle="true" :showBtn="false" @sendDataFun="getDataFun"></form-detail-component><!-- 弹窗-->
           </view>
           </scroll-view>
       </view>
       <view v-if="sendOptionData&&showAttendForm" class='submitBtn' :style='{background:assistanceDetail.buttonColor||defaultColor}' @click='submitData'>
         <text>创建助力活动</text>
       </view>
    </view>
</template>

<script>
import { socketFun } from "../../wxcomponents/public/json2Form";
export default {
  data() {
    return {
      assistanceDetail:null,
      assistanceId:0,
      setting:null,
      loginUser:null,
      secondColor:'',
      defaultColor:'',
      couponSecretCode:'',
      couponSecretPassword:'',
      couponId:-1,
      bannerImg:'',
    };
  },
  props: {},

  /*onload*/
  onLoad: function (options) {
    let that=this;
    let loginUser=getApp().globalData.loginUser||null;
    if(options.couponId){
        that.couponId=options.couponId
    }
    that.setData({options:options})
    if (loginUser) {
      that.checkState(options);
    } else {
      getApp().globalData.addLoginListener(that);
      let url='login.html?url=';
      let backUrl='gain_coupon_page.html?couponId='+(options.couponId||-1);
      url+= encodeURIComponent(backUrl)
      getApp().globalData.linkEvent(url)
    }
    console.warn("======onLoad:options======", options, getApp().globalData.setting);
  },
  onReady: function () {
    
  },
  onShow: function () {
    let that=this;
    if(that.clearTimeState){
        that.setData({clearTimeState:false})
    }
	that.setData({
        setting:getApp().globalData.setting,
        defaultColor:getApp().globalData.setting.platformSetting.defaultColor,
        secondColor:getApp().globalData.setting.platformSetting.secondColor,
       })
    if(getApp().globalData.setting&&getApp().globalData.setting.platformSetting.properties&&getApp().globalData.setting.platformSetting.properties.gainCouponBg){
        that.bannerImg=getApp().globalData.setting.platformSetting.properties.gainCouponBg
    }else{
        that.bannerImg='https://image1.sansancloud.com/xianhua/2020_10/13/14/18/5_778.jpg'
    }
    wx.setNavigationBarColor({
      frontColor: getApp().globalData.setting.platformSetting?getApp().globalData.setting.platformSetting.topColor.toLowerCase():'',
      backgroundColor: getApp().globalData.setting.platformSetting?getApp().globalData.setting.platformSetting.topBgColor:''
    });
  },
  /**
   * 生命周期函数--监听页面隐藏
   */
  onHide: function () {
      let that=this;
      console.log("==this.$refs===",that.$refs)
      that.setData({clearTimeState:true})
      try{
          that.$refs.assistancesDetailTime.setShowTimeStateFun(true);
      }catch(e){
          //TODO handle the exception
      }
  },

  /**
   * 生命周期函数--监听页面卸载
   */
  onUnload: function () {
      let that=this;
      console.log("==this.$refs===",that.$refs)
      that.setData({clearTimeState:true})
      try{
          that.$refs.assistancesDetailTime.setShowTimeStateFun(true);
      }catch(e){
          //TODO handle the exception
      }
  },
  /* 分享 app.js862行*/
  onShareAppMessage: function () {
    console.log(getApp().globalData.miniIndexPage);
    return getApp().globalData.shareForFx2(getApp().globalData.miniIndexPage);
  },
  onPullDownRefresh: function () {
    let that = this; // 下拉刷新的时候首先判断存不存在tab
    console.log("下拉");
    if (getApp().globalData.loginUser) {
      that.checkState(that.options);
    } else {
      getApp().globalData.addLoginListener(that);
    }
    that.getData(that.assistanceId);
    wx.stopPullDownRefresh();
  },
  /**
   * 页面上拉触底事件的处理函数
   */
  onReachBottom: function () {
    console.log('===onReachBottom====');
    let that = this
    // if (that.listPage.totalSize > that.listPage.page * that.listPage.pageSize) {
    //   that.listPage.page++
    //   that.findAssistanceSuccessRecordFun(that.listPage,'upload');
    // }else{
    //     wx.showToast({
    //       title: "到底了~",
    //       image: '/wxcomponents/images/icons/tip.png',
    //       duration: 1000
    //     });
    // }
  },
  methods: {
    couponSecretCodeFun:function(data){
        console.log("====couponSecretCodeFun=====",data)
        let that=this;
        let value=data.detail.value;
        that.couponSecretCode=value
    },
    couponSecretPasswordFun:function(data){
        console.log("====couponSecretPasswordFun=====",data)
        let that=this;
        let value=data.detail.value;
        that.couponSecretPassword=value
    },
    checkState: function (options) {
      let that = this;
      console.log('======checkState.loginUser======', getApp().globalData.loginUser,getApp().globalData.setting);
      if(options.assistanceId){
          that.setData({assistanceId:options.assistanceId})
          // that.getData(options.assistanceId);
          that.listPage.assistanceId=options.assistanceId
      }
      that.setData({
        loginUser: getApp().globalData.loginUser
      });
    },
    gainCouponFun:function(){
        let that = this
        let params={
            couponId:that.couponId,
            couponSecretCode:that.couponSecretCode,
            couponSecretPassword:that.couponSecretPassword,
        }
        if(!that.couponSecretCode){
            wx.showToast({
              title: '请输入您的券码',
              image: '/wxcomponents/images/icons/tip.png',
              duration: 1000
            });
            return
        }
        if(!that.couponSecretPassword){
            wx.showToast({
              title: '请输入您的券码密码',
              image: '/wxcomponents/images/icons/tip.png',
              duration: 1000
            });
            return
        }
        var customIndex = getApp().globalData.AddClientUrl("/gain_coupon.html", params)
        getApp().globalData.showToastLoading('loading', true)
        wx.request({
          url: customIndex.url,
          header: getApp().globalData.header,
          success: function (res) {
            wx.hideLoading()
            console.log(res.data);
            if(res.data.errcode){
                wx.showToast({
                  title: res.data.errMsg,
                  icon: 'none',
                  duration: 2000
                });
            }else{
                let url='my_coupons.html'
                that.tolinkUrl(url)
            }
            wx.hideLoading()
          },
          fail: function (res) {
            console.log("fail")
            wx.hideLoading()
            getApp().globalData.loadFail()
          }
        })
    },
    attendAssistanceFun:function(){
        let that=this;
        if(that.assistanceDetail.platformUserCanCreateAssistance==0){
            wx.showToast({
              title: that.assistanceDetail.platformUserCanNotCreateAssistanceReson,
              image: '/wxcomponents/images/icons/tip.png',
              duration: 1000
            });
            return
        }
        if(!that.assistanceDetail.assistRecordFormId){
            that.submitAttendAssistanceFun()
        }else{
            let showAttendForm=!that.showAttendForm;
            that.setData({
              sendOptionData: { customFormId: that.assistanceDetail.assistRecordFormId },
              showAttendForm: showAttendForm,
            })
            let animation = wx.createAnimation({
              duration: 400,
              timingFunction: 'ease',
            })
            console.log("showAttendForm",showAttendForm,that.sendOptionData)
            if (showAttendForm) {
              animation.bottom('100rpx').step()
            } else {
              animation.bottom('-200rpx').step()
            }
            that.setData({
              animationData: animation.export(),
            })
        }
    },
    /* 组件事件集合 */
    tolinkUrl: function (e) {
      console.warn("=======e=======", e);
      let linkUrl = e.currentTarget?e.currentTarget.dataset.url:e;
      getApp().globalData.linkEvent(linkUrl);
    },
    setData: function (obj) {
      let that = this;
      let keys = [];
      let val, data;
      Object.keys(obj).forEach(function (key) {
        keys = key.split('.');
        val = obj[key];
        data = that.$data;
        keys.forEach(function (key2, index) {
          if (index + 1 == keys.length) {
            that.$set(data, key2, val);
          } else {
            if (!data[key2]) {
              that.$set(data, key2, {});
            }
          }

          data = data[key2];
        });
      });
    }
  }
};
</script>
<style>
@import "./index.css";
</style>